<template>
  <div>
    <RjModal
      width="1080px"
      :visible="visible"
      :title="$t('portalAuth.portalPage')"
      @ok="onSave"
      @cancel="onClose"
    >
      <a-spin :tip="submitingStatus" size="large" :spinning="loading">
        <div style="height: 720px; overflow-y: auto">
          <PortalBaseEditor
            :portalObj="portalObj"
            :groupId="groupId"
            ref="portalBaseEditor"
          />
          <PortalViewEditor
            :portalObj="portalObj"
            :groupId="groupId"
            ref="portalViewEditor"
          />
        </div>
      </a-spin>
    </RjModal>
  </div>
</template>

<script>
import { mapState } from 'vuex';
import PortalBaseEditor from './portalBaseEditor';
import PortalViewEditor from './portalViewEditor';
import { RjModal } from '@components';
import { requestHttp, maccApi } from '@utils/index';
import _ from 'lodash';
import authSysMixin from '@project/authSys/mixin/authSysMixin';

export default {
  name: 'portalModal',
  mixins: [authSysMixin],
  props: {
    fromSdwan: {
      typeof: Boolean,
      default: false,
    },
  },
  components: {
    RjModal,
    PortalBaseEditor,
    PortalViewEditor,
  },
  created() {
    // this.getCliList();
  },
  data() {
    return {
      portalObj: null,
      //弹窗基础参数
      visible: false,
      submitingStatus: '',
      loading: false,
      // operation: this.params.operation,
    };
  },
  computed: {},
  watch: {
    // visible(val) {
    //   if (this.copyFromDevice && val) {
    //     this.getCopyDevices({ current: 1, pageSize: 10 });
    //   }
    // },
  },
  methods: {
    /**
     * @description: 显示弹框
     * @param {*} record
     * @return {*}
     */
    show(portalObj) {
      this.portalObj = portalObj;
      this.visible = true;
    },

    async onSave() {
      // 防止重复操作
      if (this.loading) {
        return;
      }

      this.zhugePoint('macc-hotspotPolicy-保存Portal页面', {
        workId: 'maccFunApply',
        funcId: 'macc-hotspotPolicy',
      });

      this.loading = true;
      this.submitingStatus = this.$t('portalAuth.sanping');
      //     正在生成缩略图……请稍后', 'Creating snapshot...Please wait.'],
      // 'authentication.portal.inSubmiting': ['正在生成缩略图……请稍后', 'Submiting...Please wait.'],

      const portalAuthConf = await this.$refs.portalBaseEditor.getConf();
      if (!portalAuthConf.valid) {
        this.loading = false;
        return;
      }
      let _portalViewConf = await this.$refs.portalViewEditor.getConf();
      let portalViewConf = _.cloneDeep(_portalViewConf);
      if (!portalViewConf.valid) {
        this.loading = false;
        return;
      } else {
        this.submitingStatus = this.$t('portalAuth.submiting');
        portalViewConf.portalads.adsStatus = portalViewConf.portalads.adsStatus
          ? 1
          : 0;
        portalViewConf.portalads.skipStatus = portalViewConf.portalads
          .skipStatus
          ? 1
          : 0;
        const params = {
          ...portalAuthConf,
          ...portalViewConf,
          groupId: this.groupId,
          tenantName: this.tenantInfo.tenantName,
        };

        if (/Default|Default Image/.test(params.logoName) && params.hasLogo) {
          params.logo = '../webres/images/mcp/logo.png';
        }

        if (/Default|Default Image/.test(params.backgroundName)) {
          params.background = '';
          params.backgroundUrl = '';
        }

        const api =
          maccApi.PORTAL_SUBMIT_POST_API.replace(
            '{tenant_name}',
            this.tenantInfo.tenantName
          ).replace('{group_id}', this.groupId) +
          `?ishttps=true&tenantId=${this.tenantInfo.tenantId}&group_id=${this.groupId}`;

        // tommy 24.6.5 这里保存的时候跟原来的不同
        const { code, msg } = await requestHttp({
          api,
          method: 'POST',
          params,
        });
        if (code == 0) {
          // tommy 24.6.21 可能出现删除后不刷新列表的情况，延迟500ms
          setTimeout(() => {
            this.loading = false;
            this.visible = false;
            this.$parent.getPortalList();
          }, 500);
        } else {
          this.loading = false;
          this.$message.warning(msg);
        }
      }
    },

    async sharePortal(item) {
      const api = maccApi.PORTAL_SHARE_POST_API.replace(
        '{group_id}',
        this.groupId
      );
      // '?portalIds=' +
      // item.uuid;

      const portalIdList = [item.uuid];
      const { code, msg } = await requestHttp({
        api,
        method: 'POST',
        params: { portalIdList },
      });
      if (code === 0) {
        this.$message.success(this.$t('deviceDetail.actionsuccess'));
      } else {
        this.$message.warning(msg);
      }
    },

    //关闭弹窗
    onClose() {
      this.loading = false;
      this.visible = false;
    },
  },
};
</script>

<style lang="less" scoped></style>
